<template>
  <div class="appre">
    <div class="appreinner">
      <img :src="circleInfo.src">
      <div class="info">
        <h2>{{circleInfo.title}}</h2>
        <div class="msg">{{circleInfo.msg}}</div>
      </div>
    </div>
  </div>
</template>

<script type="text/javascript">
  export default {
    data () {
      return {}
    },
    props: {
      circleInfo: {
          type: Object
      }
    }
  }
</script>

<style scoped>
.appre{ float: left; text-align: left; }
.appreinner{ margin: 15px; background-color: #fff; }
img{max-width: 100%; height: auto}
h2{font-size: 16px; line-height: 40px; border-bottom: 1px solid #ddd}
.msg{font-size: 14px; height: 38px; overflow: hidden}
.info{padding: 0 20px 10px 20px;}
</style>
